Boşluklar / yorumlar Javascript'i yavaşlatıyor mu?

İnsanlar genellikle komut dosyasının BOYUTUNU küçültmek, indirme hızını artırmak için, komut dosyasını ayrıştırma hızında herhangi bir fark yaratmak yerine küçültme araçları kullanır.
Beyaz alan ve yorumların, bir tarayıcının çalıştırılmasının ne kadar süreceği üzerinde çok az etkisi olacaktır, çünkü ayrıştırıcının bir boşluk mu yoksa bir yorum mu olduğunu kontrol etmesi gerekir, ancak gerçekte bu, mevcut hesaplama gücüyle çok küçük olacaktır, bu imkansız olacaktır. herhangi bir etkiye dikkat edin.
Ancak SIZE, geniş bant dünyamızda mevcut olan geniş bant genişliğine rağmen hala önemlidir.
|
Beyaz boşluklar ve yorumlar, dosyanın sunucudan asıl indirilmesini yavaşlatan JavaScript dosyasının boyutunu artırır - küçültme, JavaScript dosyasındaki gereksiz karakterleri daha küçük ve indirmeyi kolaylaştırmak için çıkarma işlemidir.
Ancak, bir kaba kuvvet saldırısından bahsettiğiniz için, darboğaz muhtemelen indirme işlemi değildir. Sizi neyin yavaşlattığını bulmak için bir profil oluşturucu kullanmayı deneyin.
|
Sunucu yükünü kolaylaştırmak için varlıklarınızı küçültmenin, birleştirmenin ve sıkıştırmanın her zaman bir anlamı vardır.
Küçültme, indirme hızını düşürmek için gereksiz boşlukları ve yorumları ortadan kaldırarak bahsettiğiniz eylemdir.
Birleştirme, büyük olasılıkla sayfa oluşturma hızında daha da büyük bir artış gösterecektir; tüm javascript dosyalarınızı tek bir dosyada ve tüm css dosyalarınızı tek bir dosyada birleştirme eylemidir (çoğu görüntü için de yapılabilir, ancak bu biraz daha fazla çalışma gerektirir). Bu, tarayıcının sayfayı görüntüleyebilmek için sunucunuza yapması gereken isteklerin miktarını azaltmak için yapılır.
GZipping, verileri sıkıştırılmış bir biçimde, bu tür verileri kabul edeceklerini belirten tarayıcılara sıkıştırmaktır. Bu, boyutu daha da azaltır, ancak her iki uçta biraz ekstra iş yükü ekler. Bundan net bir kazanç göreceksiniz.
Hangi ortamda çalıştığınıza bağlı olarak, bu konuda size yardımcı olacak, genellikle yukarıdakilerin tümünü tek seferde kapsayan farklı bileşenler vardır.
Kodunuzun sunucudan indirilmesi için geçen süre, sayfanın oluşturulmasının ne kadar süreceğini doğrudan etkiler. JavaScript engelliyor, yani bir JS bloğu, blok tamamen çalıştırılıncaya kadar daha fazla oluşturmayı engelleyecektir. Bu nedenle, javascript dosyalarınızı nereye koyduğunuz (yani, oluşturma işleminin hangi noktasında istenecekleri), tamamen indirilmesi için kaç istek gerektiği ve ne kadar veri indirileceğinin etkisi olacaktır kullanıcıya göründüğü gibi sayfanızın yüklenmesinde.
Tarayıcı kodunuzu ayrıştırdıktan sonra, ister javascript, css veya html olsun, hatırlamaya devam etmesi gereken kısmın dahili temsillerini oluşturmuş olacak ve gerçek biçimlendirme artık onu etkilemeyecektir.
|
Js kodundaki beyaz boşluğun bunun yürütülmesini yavaşlattığını düşünmüyorum. Anladığım kadarıyla bir javascript yorumlayıcısı işlemeden önce tüm yorumları ve gereksiz boşlukları kaldırıyor. Ancak indirme süresini ve dolayısıyla bir web sayfasının yükleme süresini etkileyebilir.
Biraz daha fazla bilgi için buraya bir göz atın.
|
Gerçek işlem hızı üzerinde çok az etkisi vardır veya hiç etkisi yoktur, ancak ...
Daha küçük boyut => daha az bant genişliği => daha az maliyet => ??? => kar!
|
senin cevabın
StackExchange.ifUsing ("editor", function () {
StackExchange.using ("externalEditor", function () {
StackExchange.using ("parçacıklar", işlev () {
StackExchange.snippets.init ();
});
});
}, "kod parçacıkları");
StackExchange.ready (function () {
var channelOptions = {
etiketler: "" .split (""),
id: "1"
};
initTagRenderer ("". split (""), "" .split (""), channelOptions);
StackExchange.using ("externalEditor", function () {
// Snippet'ler etkinse, snippet'lerden sonra editörü çalıştırmanız gerekir
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using ("parçacıklar", işlev () {
createEditor ();
});
}
Başka {
createEditor ();
}
});
function createEditor () {
StackExchange.prepareEditor ({
useStacksEditor: false,
heartbeatType: 'answer',
autoActivateHeartbeat: yanlış,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Destekleyen \ u003ca href = \" https: //imgur.com/ \ "\ u003e \ u003csvg class = \" svg-icon \ "width = \" 50 \ "height = \" 18 \ "viewBox = \ "0 0 50 18 \" fill = \ "yok \" xmlns = \ "http: //www.w3.org/2000/svg \" \ u003e \ u003cpath d = \ "M46.1709 9.17788C46.1709 8.26454 46.2665 7.94324 47.1084 7.58816C47.4091 7.46349 47.7169 7.36433 48.0099 7.26993C48.9099 6.97997 49.672 6.73443 49.672 5.93063C49.672 5.22043 48.9832 4.61182 48.1414C.61182C47.4335 4.61182 4.67324 4.91628 43.1481 6.59048V11.9512C43.1481 13.2535 43.6264 13.8962 44.6595 13.8962C45.6924 13.8962 46.1709 13.2535 46.1709 11.9512V9.17788Z \ "/ \ u003e \ u003cyol d = \" M32.492 10.14.94723.048 12.6954.0723.048 41.5985 12.6954 41.5985 10.1419V6.59049C41.5985 5.28821 41.1394 4.6623240.1061 4.66232C39.0732 4.66232 38.5948 5.28821 38.5948 6.59049V9.60062C38.5948 10.8521 38.2696 11.5455 37.0451 11.5455C35.8209 11.5455 35.4954 10.8521 35.4954 9.60062V6.59021.021 4.17322 "/ \ u003e \ u003cyol doldurma kuralı = \" çift kişilik \ "klip kuralı = \" çift kişilik \ "d = \" M25.6622 17.6335C27.8049 17.6335 29.3739 16.9402 30.2537 15.6379C30.8468 14.7755 30.9615 13.5579 30.9615 11.95 59049C30.9615 5.28821 30.4833 4.66231 29.4502 4.66231C28.9913 4.66231 28.4555 4.94978 28.1109 5.50789C27.499 4.86533 26.7335 4.56087 25.7005 4.56087C23.1369 4.56013 21.0134 6.57349 21.0134 9.98512.00 1108 18 21.2429 15.0123 21.2429 15.6887C21.2429 16.7375 22.9072 17.6335 25.6622 17.6335ZM24.1317 9.27932C24.1317 7.94324 24.9928 7.09766 26.1024 7.09766C27.2119 7.09766 28.0918 7.94324 28.0918 9.27932C \ "/ \ u003e \ u003cyol d = \" M16.8045 11.9512C16.8045 13.2535 17.2637 13.8962 18.2965 13.8962C19.3298 13.8962 19.8079 13.2535 19.8079 11.9512V8.12928C19.8079 5.82936 18.4879 4.62866 16.402712 4.628 .653 5.05154 11.6581 4.62866 10.3573 4.62866C9.34336 4.62866 8.57809 4.89931 7.9466 5.5079C7.58314 4.9328 7.10506 4.66232 6.51203 4.66232C5.47873 4.66232 5.00066 5.28821 5.00066 6.59049.9532 13.953296 .90741C8.0232 7.58817 8.44431 6.91179 9.53458 6.91179C10.5104 6.91179 10.893 7.58817 10.893 8.94108V11.9512C10.893 13.2535 11.3711 13.8962 12.4044 13.8962C13.4375 13.8962 13.915 7 13.2535 13.9157 11.9512V8.90741C13.9157 7.58817 14.3365 6.91179 15.4269 6.91179C16.4027 6.91179 16.8045 7.58817 16.8045 8.94108V11.9512Z \ "/ \ u003e \ u003cpath d = \" M3.3160 ​​5.28821 4.6666 791758 4.66232 0.313354 5.28821 0.313354 6.59049V11.9512C0.313354 13.2535 0.791758 13.8962 1.82471 13.8962C2.85798 13.8962 3.31675 13.2535 3.31675 11.9512V6.59049Z \ "/ \ u003e \ u003.849 0.40029 C0 2.87869 0.822846 3.57676 1.87209 3.57676C2.90056 3.57676 3.7234 2.87869 3.7234 1.98861C3.7234 1.1159 2.90056 0.400291 1.87209 0.400291Z \ "dolgu = \" # 1BB76E \ "/ \ u003e \ u003e \ u003c \ svg
contentPolicyHtml: "\ u003ca href = \" https: //stackoverflow.com/help/licensing \ "\ u003ecc by-sa \ u003c / a \ u003e \ u003ca href = \" https://stackoverflow.com altında lisanslanan kullanıcı katkıları / legal / content-policy \ "\ u003e (içerik politikası) \ u003c / a \ u003e",
allowUrls: true
},
onDemand: doğru,
discardSelector: ".discard-answer"
, hemenShowMarkdownHelp: true, enableTables: true, enableSnippets: true
});
}
});
Stack Overflow'a yanıt verdiğiniz için teşekkür ederiz!
Lütfen soruyu yanıtladığınızdan emin olun. Ayrıntıları sağlayın ve araştırmanızı paylaşın!
Ama kaçının ...
Yardım istemek, açıklama yapmak veya diğer cevaplara cevap vermek.
Görüşe dayalı açıklamalarda bulunmak; bunları referanslarla veya kişisel deneyimlerle destekleyin.
Daha fazla bilgi edinmek için harika yanıtlar yazma konusundaki ipuçlarımıza bakın.
Taslak kaydedildi
Taslak silindi
Kaydolun veya oturum açın
StackExchange.ready (function () {
StackExchange.helpers.onClickDraftSave ('# login-link');
});
Google kullanarak kaydolun
Facebook kullanarak kaydolun
E-posta ve Şifre kullanarak kayıt olun
Sunmak
Misafir olarak yayınlayın
İsim
E-posta adresi
Gerekli ama asla gösterilmez
StackExchange.ready (
function () {
StackExchange.openid.initPostLogin ('. Yeni-giriş-sonrası', 'https% 3a% 2f% 2fstackoverflow.com% 2fquestions% 2f4423553% 2fdo-space-comments-slow-javascript-down% 23new-answer', 'question_page' );
}
);
Misafir olarak yayınlayın
İsim
E-posta adresi
Gerekli ama asla gösterilmez
Cevabınızı Gönderin
At
"Cevabınızı Gönderin" i tıklayarak, hizmet şartlarımızı, gizlilik politikamızı ve çerez politikamızı kabul etmiş olursunuz.
Aradığın cevap değil mi? Javascript etiketli diğer sorulara göz atın veya kendi sorunuzu sorun.